<template>
    <div class="common-layout">
        <el-container>
            <el-aside width="200px">
                <LeftMenu></LeftMenu>
            </el-aside>
            <el-container>
                <el-header>
                    <right-top></right-top>
                </el-header>
                <el-main>
                    <router-view></router-view>
                </el-main>
            </el-container>
        </el-container>
    </div>
</template>

<script setup>
import { RouterView } from 'vue-router';
import LeftMenu from '@/components/LeftMenu.vue';
import RightTop from '@/components/RightTop.vue';
</script>

<style lang="less" scoped>
.common-layout {
    width: 100%;
    height: 100%;

    .el-container {
        width: 100%;
        height: 100%;

        .el-aside {
            background-color: #3CA2E0;
        }

        .el-header {
            box-shadow: 0 0px 10px 0 rgba(0, 0, 0, 0.1);
        }
    }
}
</style>